import React, { Component } from 'react';

import { connect } from 'dva';
import withRouter from 'umi/withRouter';
import { persistStore } from 'redux-persist';
import { PersistGate } from 'redux-persist/es/integration/react';
import { Spin } from 'antd';

import styles from './index.css';

/**
 * 全局页面框架
 */
class Index extends Component {

  _reduxPersistor = null;

  constructor(props) {
    super(props);
    
    // 初始化reduxPersistor
    this._initReduxPersistor();
  }

  render() {
    const { loadingState, children } = this.props;

    if (!!loadingState) return this._renderPageLoading();
    
    return (
      <div>
        <PersistGate loading={null} persistor={this._reduxPersistor}>
          {children}
        </PersistGate>
      </div>
    );
  }

  /**
   * 渲染加载
   */
  _renderPageLoading = () => {
    return (
      <div style={{ textAlign: 'center', paddingTop: 300}}>
        <Spin size="large" tip="加载中..." />
      </div>
    );
  }

  componentDidMount() {
    
  }

  _initReduxPersistor = () => {
    this._reduxPersistor = persistStore(window.g_app._store, { manualPersist: false });
    window.g_reduxPersistor = this._reduxPersistor;
  }

}

const mapStateToProps = (state) => {
  const { loadingState } = state.global;

  return {
    loadingState,
  };
}

export default withRouter(connect(mapStateToProps)(Index));